<!DOCTYPE html>
<html lang="en">
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
        <script src="./lib/vue-2.4.0.js"></script>
    </head>
    <body>
        <div id="app">
            <p>{{msg}}</p>
            <com @fun="father">  </com>
        </div>
        <!-- //com模板 -->
        <template id="tem">
            <div>
                <a href="javascript:;">什么情况</a>
                <input type="button" value="这是获取父元素方法的按钮" @click="sonclick">
            </div>
        </template>
        <script>
            Vue.component('com',{
                template:'#tem',
                data(){
                    return{
                        son:{id:1,name:'st'}
                    }
                },
                methods:{
                    sonclick(){
                        //
                        this.$emit('fun',this.son.name)
                    }
                }
            })





            
            var vm = new Vue({
                el: '#app',
                data: {
                    msg:null
                },
                methods:{
                    father(data){
                        console.log('我是父元素的方法'+data)
                        this.msg=data
                    }

                }
            })
        </script>
    </body>
</html>